<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('首页')" />

</head>
<script src="js/search.js"></script>
<body>
<th:block th:include="include :: top" />
<header class="search">
    <a href="./" class="logo">
        <img src="img/logo2.png">
    </a>
    <div class="search">
        <form action="search" >
            <input type="text" placeholder="搜索 ${website_name} 商品/品牌/店铺" name="keyword">
            <button class="search-button" type="submit">搜索</button>
        </form>
    </div>

</header>

<section class="select-bar">
    <a href="?id=${category.id}" class="${empty param.sort?'selected':''}">综合<span class="glyphicon glyphicon-arrow-down"></span></a>
    <a href="?id=${category.id}&sort=comment" class="${param.sort=='comment'?'selected':''}">人气<span class="glyphicon glyphicon-arrow-down"></span></a>
    <a href="?id=${category.id}&sort=date" class="${param.sort=='date'?'selected':''}">新品<span class="glyphicon glyphicon-arrow-down"></span></a>
    <a href="?id=${category.id}&sort=saleCount" class="${param.sort=='saleCount'?'selected':''}">销量<span class="glyphicon glyphicon-arrow-down"></span></a>
    <a href="?id=${category.id}&sort=${param.sort=='price'?'priceInverse':'price'}" class="${(param.sort=="price"||param.sort=="priceInverse")?'selected':''}">价格<span class="glyphicon glyphicon-resize-vertical"></span></a>
    <span class="price">
        <input type="text" placeholder="￥请输入" class="sortBarPrice beginPrice" id="low_price">
        <span>-</span>
        <input type="text" placeholder="￥请输入" class="sortBarPrice beginPrice" id="high_price">
    </span>
</section>

<main class="search">
    <div class="items">
        <div th:each="p : ${product}" class="border" th:attr="price=${p.Price}">
            <a th:href="@{/product(id=${p.id})}">
                <div class="item">
                    <div class="content">
<!--                        <img class="item-img" th:src="${productImgDir}${p.image.path}">-->
                        <img src="img/香香.jpg" style="width: 200px; height: 150px;">
                        <div class="item-price">￥[[${p.Price}]]</div>
                        <div class="item-title">[[${p.name}]]</div>
                        <div class="item-shop"></div>
                        <div class="item-bottom">
                            <span>月成交<em>[[${p.saleCount}]]笔</em></span>
                            <span>评价<a th:href="@{/product(id=${p.id})}">[[${p.commentCount}]]条</a></span>
                            <span><img src="img/wangwang.png"></span>
                        </div>
                    </div>
                </div>
            </a>
        </div>
<!--        <div th:if="${#lists.isEmpty(products)}" class="no-match">没有满足条件的产品</div>-->
    </div>
</main>

<th:block th:include="include :: footer" />

</body>
</html>